<html>
<head>
<title> - Mes Sujets - Options</title>
<link rel="StyleSheet" href="style.css" type="text/css"/>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Ubuntu">
<script src="prefs.js"></script>
<script src="web.js"></script>
<script src="behaviour.js"></script>
<script src="log.js"></script>
<script type="text/javascript">

function setVisible(element, isVisible) {
  if (isVisible) {
    element.style.display = 'block';
  } else {
    element.style.display = 'none';
  }
}

// Restores select box state to saved value from localStorage.
function initControls() {
  var site = chrome.extension.getBackgroundPage().site;
  var refTimeInput = document.getElementById("REFRESH_TIME");
  refTimeInput.value = getPref(REFRESH_TIME);
  refTimeInput.onchange = function(event) {
    var refTime = parseInt(this.value);
    var site = chrome.extension.getBackgroundPage().site;
    if (isNaN(refTime)) {
      document.getElementById("REFRESH_TIME.error").innerText = "Des entiers seulement, merci!";
    } else if (refTime < site.minRefreshTime) {
      document.getElementById("REFRESH_TIME.error").innerText = "Merci de ne pas jouer au bourrin. "+site.minRefreshTime+" secondes minimum.";
    } else {
      document.getElementById("REFRESH_TIME.error").innerText = "";
      setPref(REFRESH_TIME, refTime);
    }
    chrome.extension.getBackgroundPage().startRequest();
  };
  refTimeInput.onkeyup=refTimeInput.onchange;
  
  var maxOpenAllInput = document.getElementById("MAX_OPEN_ALL");
  maxOpenAllInput.value = getPref(MAX_OPEN_ALL);
  maxOpenAllInput.onchange = function(event) {
    var maxOpenAll = parseInt(this.value);
    if (isNaN(maxOpenAll)) {
      document.getElementById("MAX_OPEN_ALL.error").innerText = "Des entiers seulement, merci!";
    } else {
      document.getElementById("MAX_OPEN_ALL.error").innerText = "";
      setPref(MAX_OPEN_ALL, maxOpenAll);
    }
    chrome.extension.getBackgroundPage().startRequest();
  };
  maxOpenAllInput.onkeyup=maxOpenAllInput.onchange;

  if (site.getSetupUrl) {
    var bgColorInput = document.getElementById("BG_COLOR");
    bgColorInput.value = getPref(BG_COLOR);
    bgColorInput.onchange = function(event) {
      setPref(BG_COLOR, this.value);
    };
    bgColorInput.onkeyup=bgColorInput.onchange;
  
    var setDefaultColorA = document.getElementById('setDefaultColor');
    setDefaultColorA.onclick = function() {
      bgColorInput.value = PREFS_DEFAULT[BG_COLOR];
      setPref(BG_COLOR, bgColorInput.value);
    }
  } else {
    document.getElementById("BG_COLOR.div").parentNode.removeChild(document.getElementById("BG_COLOR.div"));
  }
  var directLinkInput = document.getElementById('USE_DIRECT_LINK');
  directLinkInput.checked = getPref(USE_DIRECT_LINK);
  directLinkInput.onchange = function (event) {
    setPref(USE_DIRECT_LINK, this.checked);
    initBehaviour();
  };

  var openCat = document.getElementById('OPEN_CAT');
  openCat.checked = getPref(OPEN_CAT);
  openCat.onchange = function (event) {
    setPref(OPEN_CAT, this.checked);
    initBehaviour();
  };
  
  var onlyFavsInput = document.getElementById('ONLY_FAVS');
  onlyFavsInput.checked = getPref(ONLY_FAVS);
  onlyFavsInput.onchange = function (event) {
    setPref(ONLY_FAVS, this.checked);
    initBrowserActionTitle();
  };
  
  var aniIconInput = document.getElementById('ANIMATED_ICON');
  aniIconInput.checked = getPref(ANIMATED_ICON);
  aniIconInput.onchange = function (event) {
    setPref(ANIMATED_ICON, this.checked);
  };
  
  var contextMenuInput = document.getElementById('USE_CONTEXT_MENU');
  contextMenuInput.checked = getPref(USE_CONTEXT_MENU);
  contextMenuInput.onchange = function (event) {
    setPref(USE_CONTEXT_MENU, this.checked);
    initBehaviour();
  };
  
  var newTabInput = document.getElementById('NEW_TAB');
  newTabInput.checked = getPref(NEW_TAB);
  newTabInput.onchange = function (event) {
    setPref(NEW_TAB, this.checked);
  };
  
  var debugOnInput = document.getElementById('DEBUG_ON');
  debugOnInput.checked = getPref(DEBUG_ON);
  debugOnInput.onchange = function (event) {
    setPref(DEBUG_ON, this.checked);
  };
  
  var showCat = document.getElementById('SHOW_CAT');
  showCat.checked = getPref(SHOW_CAT);
  if (showCat.checked) {
    document.getElementById('OPEN_CAT.div').style.visibility = 'visible';
  } else {
    document.getElementById('OPEN_CAT.div').style.visibility = 'hidden';
  }
  showCat.onchange = function (event) {
    setPref(SHOW_CAT, this.checked);
    if (showCat.checked) {
      document.getElementById('OPEN_CAT.div').style.visibility = 'visible';
    } else {
      document.getElementById('OPEN_CAT.div').style.visibility = 'hidden';
    }
  };
  
  var getTopics = document.getElementById('GET_TOPICS');
  getTopics.checked = getPref(GET_TOPICS);
  if (getTopics.checked) {
      document.getElementById('SHOW_CAT.div').style.visibility = 'visible';
      document.getElementById('ONLY_FAVS.div').style.visibility = 'visible';
    } else {
      document.getElementById('ONLY_FAVS.div').style.visibility = 'hidden';
      document.getElementById('SHOW_CAT.div').style.visibility = 'hidden';
  }
  getTopics.onchange = function (event) {
    setPref(GET_TOPICS, this.checked);
    if (getTopics.checked) {
      document.getElementById('SHOW_CAT.div').style.visibility = 'visible';
      document.getElementById('ONLY_FAVS.div').style.visibility = 'visible';
    } else {
      document.getElementById('ONLY_FAVS.div').style.visibility = 'hidden';
      document.getElementById('SHOW_CAT.div').style.visibility = 'hidden';
    }
  };
  
  var getMps = document.getElementById('GET_MPS');
  getMps.checked = getPref(GET_MPS);
  getMps.onchange = function (event) {
    setPref(GET_MPS, this.checked);
  };
  
  initMuted();
  
  document.title = site.name + " - Mes Sujets - Options";
}

function initMuted() {
  var mutedTopics = getPref(MUTED_TOPICS).split('|');
  mutedTopicsInnerHtml = '<ul id="muted">';
  var topic = null;
  
  for (var i = 0; i < mutedTopics.length; i++) {
    topic = mutedTopics[i];
    if (topic.indexOf('#') != -1) {
      mutedTopicsInnerHtml += '<li>';
      var splitted = topic.split('#');
      mutedTopicsInnerHtml += splitted[2] + " <button onclick='javascript:unmute(" + splitted[0] + ',' + splitted[1] + ");'>unmute</button><br/>";
      mutedTopicsInnerHtml += '</li>';
    }
  }
  mutedTopicsInnerHtml += '</ul>';
  document.getElementById('muted').innerHTML = mutedTopicsInnerHtml;
}

function unmute(cat, topic) {
  _unmute(cat, topic);
  initMuted();
  chrome.extension.getBackgroundPage().startRequest();
}
</script>
</head>
<body onload="initControls()">
  <div id="prefs">
    <div>
      <span><label for="REFRESH_TIME">Temps de rafra&icirc;chissement  en secondes :</label></span>
      <span><input type="text" name="REFRESH_TIME" id="REFRESH_TIME"/></span>
      <div id="REFRESH_TIME.error" class="error"></div>
    </div>
    <div>
      <span><label for="GET_TOPICS">R&eacute;cup&eacute;rer le nombre de topics non lus :</label></span>
      <span><input type="checkbox" name="GET_TOPICS" id="GET_TOPICS"/></span>
    </div>
    <div>
      <span><label for="GET_MPS">R&eacute;cup&eacute;rer le nombre de messages priv&eacute;s non lus :</label></span>
      <span><input type="checkbox" name="GET_MPS" id="GET_MPS"/></span>
    </div>
    <div>
      <span><label for="MAX_OPEN_ALL" title="En cas de 'Tout ouvrir' ou de click sur une cat&eacute;gorie, une confirmation sera demand&eacute;e au-del&agrave; de ce nombre.">Nombre max. d'onglets ouverts sans avertissement :</label></span>
      <span><input type="text" name="MAX_OPEN_ALL" id="MAX_OPEN_ALL"/></span>
      <div id="MAX_OPEN_ALL.error" class="error"></div>
    </div>
    <div id="ONLY_FAVS.div">
      <span><label for="ONLY_FAVS" title="Si d&eacute;coch&eacute;, rafra&icirc;chit les drapeaux cyans et les favoris.">Rafra&icirc;chir uniquement les favoris :</label></span>
      <span><input type="checkbox" name="ONLY_FAVS" id="ONLY_FAVS"/></span>
    </div>
    <div>
      <span><label for="USE_DIRECT_LINK" title="Si d&eacute;coch&eacute;, affichage de la popup.">Le click sur l'ic&ocirc;ne envoie directement sur la page des favoris :</label></span>
      <span><input type="checkbox" name="USE_DIRECT_LINK" id="USE_DIRECT_LINK"/></span>
    </div>
    <div id="SHOW_CAT.div">
      <span><label for="SHOW_CAT">Afficher le nom des cat&eacute;gories dans la popup :</label></span>
      <span><input type="checkbox" name="SHOW_CAT" id="SHOW_CAT"/></span>
    </div>
    <div id="OPEN_CAT.div">
      <span><label for="OPEN_CAT" title="Si d&eacute;coch&eacute;, affiche la page de favoris de la cat&eacute;gorie.">Le click sur le nom de la cat&eacute;gorie, dans la popUp, ouvre tous les topics non lus de la cat.</label></span>
      <span><input type="checkbox" name="OPEN_CAT" id="OPEN_CAT"/></span>
    </div>
    <div>
      <span><label for="USE_CONTEXT_MENU" title="Le menu appara&icirc;t au click droit sur une page.">Utiliser le menu contextuel pour rafra&icirc;chir :</label></span>
      <span><input type="checkbox" name="USE_CONTEXT_MENU" id="USE_CONTEXT_MENU"/></span>
    </div>
    <div>
      <span><label for="ANIMATED_ICON">Animer l'icone de l'extension si il y a des topics non lus :</label></span>
      <span><input type="checkbox" name="ANIMATED_ICON" id="ANIMATED_ICON"/></span>
    </div>
    <div>
      <span><label for="NEW_TAB" title="Ne sera pas pris en compte pour l'action 'Ouvrir tout'.">Ouverture des liens dans un nouvel onglet :</label></span>
      <span><input type="checkbox" name="NEW_TAB" id="NEW_TAB"/></span>
    </div>
    <div id="BG_COLOR.div">
      <span><label for="BG_COLOR">Couleur principale de l'extension (voir <a href="http://fr.wikipedia.org/wiki/Couleurs_du_Web">ici</a> pour les codes couleurs) :</label></span>
      <span><input type="text" name="BG_COLOR" id="BG_COLOR"/></span>
      <a id="setDefaultColor" href="#">Couleur par d&eacute;faut</a>
      <div id="BG_COLOR.error" class="error"></div>
    </div>
    <div>
      <span>Sujets non comptabilis&eacute;s :</span>
      <span id="muted">
      </span>
    </div>
    <div>
      <span><label for="DEBUG_ON" title="Les messages seront disponibles dans la console.">Mode debug :</label></span>
      <span><input type="checkbox" name="DEBUG_ON" id="DEBUG_ON"/></span>
    </div>
  </div>
</body>
</html>
